<template>
  <div class="">
    <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
      <van-swipe-item v-for="(item,index) in swipeList" :key="index">
          <img :src="item.image_src" alt="">
      </van-swipe-item>
    </van-swipe>
    <span @click="$router.replace('/classPage')">
        <i>分类</i>
    </span>
  </div>
</template>

<script>
import { ref, reactive, toRefs } from "vue";
import axios from "axios";
import { Toast } from "vant";
export default {
  setup() {
    Toast.loading({
      message: "加载中...",
      forbidClick: true,
      duration: 0,
    });

    const data = reactive({
      swipeList: [], // 轮播图的数据
    });
    axios
      .get("https://api-hmugo-web.itheima.net/api/public/v1/home/swiperdata")
      .then((res) => {
        Toast.clear();
        // console.log(res);
        data.swipeList = res.data.message;
      });
    return {
      ...toRefs(data),
    };
  },
};
</script>
<style lang="scss" scoped>
</style>